<template>
  <div class="editCompany">
    <el-form ref="company" :model="company" label-width="100px" :rules="rules">
      <el-form-item label="企业名称" prop="title">
        <el-input v-model="company.title"></el-input>
      </el-form-item>
      <el-form-item label="企业规模" prop="scale">
        <el-select v-model="company.scale" placeholder="请选择活动区域">
          <el-option v-for="(item,index) in scaleArr" :key="index" :label="item" :value="index+1"></el-option>
        </el-select>
      </el-form-item>
      <!-- <el-form-item label="地图选择" prop="name">
        <div style="display:flex;width:100%">
          <el-input v-model="company.name"></el-input>
          <a href="javascript:void(0)">
            <div
              class="submitBtn"
              style="cursor:hand"
              @click="openMapFn(cityInfo,'selectCity')"
            >地图选择</div>
          </a>
        </div>
      </el-form-item>-->
      <el-form-item label="企业地址" prop="address">
        <el-input v-model="company.address"></el-input>
      </el-form-item>
      <el-form-item label="企业介绍" prop="description">
        <el-input type="textarea" v-model="company.description" rows="8"></el-input>
      </el-form-item>
      <el-form-item label="企业环境">
        <el-upload
          action
          list-type="picture-card"
          multiple
          :file-list="fileList"
          :on-preview="handlePictureCardPreview"
          :on-remove="handleBackRemove"
          :before-upload="upLoadBackImg"
        >
          <i class="el-icon-plus"></i>
        </el-upload>
        <el-dialog :visible.sync="dialogVisible">
          <img width="100%" :src="dialogImageUrl" alt />
        </el-dialog>
      </el-form-item>
      <el-form-item label="企业资质" v-if="licenseImg.auth_status != 1">
        <el-upload
          action
          list-type="picture-card"
          :multiple="false"
          :file-list="preLicense"
          :on-preview="handlePictureCardPreview"
          :on-remove="handleIdenRemove"
          :before-upload="upLoadIdenImg"
        >
          <i class="el-icon-plus"></i>
        </el-upload>
        <el-dialog :visible.sync="dialogVisible">
          <img width="100%" :src="dialogImageUrl" alt />
        </el-dialog>
      </el-form-item>
      <el-form-item>
        <div class="btnBlock">
          <a href="javascript:void(0)" @click="confirm">
            <div class="submitBtn" style="cursor:hand">立即{{type == 'create' ? '创建':'保存'}}</div>
          </a>
        </div>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
import { CompanyShow, ShowLicense, Describe, License } from "~/api/allRequest";
import config from "~/config.js";
import { upLoadImage } from "~/public/js/public";

export default {
  name: "editCompany",
  data() {
    return {
      rules: {
        title: [{ required: true, message: "请输入企业名称", trigger: "blur" }],
        scale: [{ required: true, message: "请选择企业规模", trigger: "blur" }],
        address: [
          { required: true, message: "请输入企业地址", trigger: "blur" }
        ],
        description: [
          { required: true, message: "请输入企业介绍", trigger: "blur" }
        ]
      },
      companyId: "",
      company: {},
      licenseImg: {},
      scaleArr: ["10人以下", "10-20人", "20-50人", "50-100人", "100以上"],
      dialogImageUrl: "",
      dialogVisible: false,
      fileList: [],
      cityInfo: {
        numPosition: {}
      },
      type: "create",
      preLicense: [],
      upLoadUrl: "",
      proveItem: {}
    };
  },
  components: {},
  beforeCreate() {},
  created() {},
  beforeMount() {},
  mounted() {
    this.type = this.$route.params.type;
    if (localStorage.getItem("company")) {
      this.companyId = localStorage.getItem("company");
      this.getInfo();
    }
  },
  beforeUpdate() {},
  updated() {},
  beforeDestroy() {},
  destroy() {},
  methods: {
    getInfo() {
      CompanyShow()
        .then(result => {
          let temp = [];
          for (let i = 0; i < result.image.length; i++) {
            let tempObj = {};
            tempObj.name = result.image[i].image_url;
            tempObj.url = result.image[i].image_url;
            temp.push(tempObj);
          }
          this.fileList = temp;
          this.company = result;
        })
        .catch(err => {
          console.log(err);
        });

      ShowLicense()
        .then(result => {
          this.preLicense = [{ url: result.auth_image, name: 1 }];
          this.licenseImg = result;
        })
        .catch(err => {
          console.log(err);
        });
    },
    confirm() {
      let formItem = {
        ...this.company
      };
      //处理上传环境图片数据
      let temp = [];
      for (let i = 0; i < this.fileList.length; i++) {
        temp.push(this.fileList[i].url);
      }
      formItem.image = JSON.stringify(temp);

      //处理认证图片
      let auth_image = this.preLicense.url;
      Describe(formItem)
        .then(result => {
          if (this.licenseImg.auth_status != 1) {
            License({ auth_image })
              .then(result => {
                this.$message.success(
                  this.type == "create" ? "已提交申请" : "保存成功"
                );
                setTimeout(() => {
                  if (this.type == "create") {
                    this.$router.push({ name: "recuitIndex" });
                  } else {
                    this.$router.push({ name: "companyInfo" });
                  }
                }, 1500);
              })
              .catch(err => {
                this.$message.error(err);
              });
          } else {
            this.$message.success(
              this.type == "create" ? "已提交申请" : "保存成功"
            );
          }
        })
        .catch(err => {
          this.$message.error(err);
        });
    },
    handleBackRemove(file) {
      for (let i = 0; i < this.fileList.length; i++) {
        if (this.fileList[i].uid == file.uid) {
          this.fileList.splice(i, 1);
        }
      }
    },
    handleIdenRemove(file) {
      this.preLicense = [];
    },
    handlePictureCardPreview(file) {
      this.dialogImageUrl = file.url;
      this.dialogVisible = true;
    },
    upLoadBackImg(file) {
      upLoadImage(file)
        .then(result => {
          this.fileList.push({
            url: result,
            name: result
          });
        })
        .catch(err => {
          console.log(err);
        });
    },
    upLoadIdenImg(file) {
      upLoadImage(file)
        .then(result => {
          this.preLicense = [
            {
              url: result,
              name: result
            }
          ];
        })
        .catch(err => {
          console.log(err);
        });
    }
  }
};
</script>

<style scoped lang="less">
@import "./../../../public/less/main.less";
.selected {
  margin-bottom: 0;
  height: auto;
}
.editCompany {
  width: 54%;
  min-height: 800px;
  background: white;
  margin: 1% 0;
  padding: 2% 12%;
  .el-select {
    display: block;
  }
  .btnBlock {
    width: 100%;
    display: flex;
    justify-content: center;
    margin-top: 30px;
  }
}
</style>
